<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>熊猫影城后台管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="//cdn.staticfile.net/layui/2.9.11/css/layui.css" rel="stylesheet">
</head>
<body>
<div class="layui-layout layui-layout-admin">
    <div class="layui-header">
        <div class="layui-logo layui-hide-xs layui-bg-black">超级管理员</div>
        <!-- 头部区域（可配合layui 已有的水平导航） -->
        <ul class="layui-nav layui-layout-left">
            <!-- 移动端显示 -->
            <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-header-event="menuLeft">
                <i class="layui-icon layui-icon-spread-left"></i>
            </li>
        </ul>
        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item layui-hide layui-show-sm-inline-block">
                <a href="javascript:;">
                    <img src="//unpkg.com/outeres@0.0.10/img/layui/icon-v2.png" class="layui-nav-img">
                    tester
                </a>
                <dl class="layui-nav-child">
                    <dd><a href="javascript:;">Your Profile</a></dd>
                    <dd><a href="javascript:;">Settings</a></dd>
                    <dd><a href="javascript:;">Sign out</a></dd>
                </dl>
            </li>
            <li class="layui-nav-item" lay-header-event="menuRight" lay-unselect>
                <a href="javascript:;">
                    <i class="layui-icon layui-icon-more-vertical"></i>
                </a>
            </li>
        </ul>
    </div>
    <div class="layui-side layui-bg-black">
        <div class="layui-side-scroll">
            <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
            <ul class="layui-nav layui-nav-tree" lay-filter="test">
                <li class="layui-nav-item">
                    <a class="Admin_index.html" href="javascript:;">首页</a>
                    <dl class="layui-nav-child">
                        <dd><a href="Admin_index.html">首页</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item ">
                    <a class="Admin_Cinema.html" href="javascript:;">影院管理</a>
                    <dl class="layui-nav-child">
                        <dd><a href="Admin_Cinema.html">影院管理</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;">电影管理</a>
                    <dl class="layui-nav-child">
                        <dd><a href="Admin_FilmInfo.html">电影信息管理</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;">影厅管理</a>
                    <dl class="layui-nav-child">
                        <dd><a href="Admin_Cinema.html">影厅管理</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;">订单管理</a>
                    <dl class="layui-nav-child">
                        <dd><a href="Admin_Order.html">订单管理</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item layui-nav-itemed">
                    <a href="javascript:;">用户管理</a>
                    <dl class="layui-nav-child">
                        <dd><a href="Admin_User.html">用户管理</a></dd>
                    </dl>
                </li>
            </ul>
        </div>
    </div>

    <div class="layui-body">
        <!-- 内容主体区域 -->
        <div style="padding: 15px;">
            <blockquote class="layui-elem-quote layui-text">
                <div class="layui-btn-container">
                    <button type="button" class="layui-btn layui-btn-sm"  lay-on="add">添加电影信息</button>
                    <button type="button" class="layui-btn layui-btn-sm"  lay-on="delete">删除电影信息</button>
                    <button type="button" class="layui-btn layui-btn-sm"  lay-on="fix">修改电影信息</button>
                    <button type="button" class="layui-btn layui-btn-sm"  lay-on="search">搜索电影信息</button>
                </div>
            </blockquote>
            <div class="layui-card layui-panel ">
                <table class="layui-table" lay-filter="test" id="filmTable">
                    <thead>
                    <tr>
                        <th>电影ID</th>
                        <th>名称</th>
                        <th>类型</th>
                        <th>时长</th>
                        <th>放映时间</th>
                        <th>价格</th>
                        <th>区域</th>
                        <th>上映时间</th>
                        <th>总票房</th>
                        <th>简介</th>
                    </tr>
                    <tableBody>
                        <!-- 从后端获取的电影信息会填充这里 -->
                    </tableBody>
                    </thead>
                </table>
            </div>
            <br><br>
        </div>
    </div>
</div>
<script src="//cdn.staticfile.net/layui/2.9.11/layui.js"></script>
<script src="/js/jquery-3.4.1.js" type="text/javascript" charset="utf-8"></script>
<script>
    layui.use(function(){
        var layer = layui.layer;
        var util = layui.util;
        // 批量事件
        util.on('lay-on', {
            add: function() {
                layer.open({
                    type: 2,
                    title: '添加电影信息',
                    shadeClose: true,
                    shade: 0.8,
                    area: ['40%', '95%'],
                    content:['http://localhost:8082/templates/Admin_AddMovie.html']
                });
            }
            ,delete: function() {
                layer.open({
                    type: 2,
                    title: '删除电影信息',
                    shadeClose: true,
                    shade: 0.8,
                    area: ['50%', '50%'],
                    content: 'http://localhost:8082/templates/Admin_DeleteMovie.html'
                });
            }
            ,fix: function() {
                layer.open({
                    type: 2,
                    title: '修改电影信息',
                    shadeClose: true,
                    shade: 0.8,
                    area: ['50%', '50%'],
                    content: 'http://localhost:8082/templates/Admin_deleteMovie.html'
                });
            }
            ,search: function() {
                layer.open({
                    type: 2,
                    title: '搜索电影信息',
                    shadeClose: true,
                    shade: 0.8,
                    area: ['50%', '50%'],
                    content: 'Admin_FilmInfo_search.html'
                });
            }
        });
    });
</script>


<!-- 通过AJAX请求获取所有电影信息并显示在表格中 -->
<script type="text/javascript">
    /* 发起AJAX请求获取所有电影信息 */
    $.ajax({
        /* 请求类型为GET */
        type: "GET",
        /* 请求的URL地址 */
        url: "http://localhost:8082/movie/findAllMovies",
        /* 期望服务器返回的数据类型为JSON */
        dataType: "json",
        /* 请求成功后的回调函数 */
        success: function (data) {
            /* 获取电影表格的主体部分 */
            var tableBody = $("#filmTable");
            /* 遍历返回的电影数据 */
            data.forEach(function(movie) {
                /* 创建一个新的表格行 */
                var row = $("<tr></tr>");
                row.append("<td>" + movie.movieId + "</td>");
                row.append("<td>" + movie.movieName + "</td>");
                row.append("<td>" + movie.movieType + "</td>");
                row.append("<td>" + movie.movieLength + "</td>");
                row.append("<td>" + movie.movieTime + "</td>");
                row.append("<td>" + movie.moviePrice + "</td>");
                row.append("<td>" + movie.movieArea + "</td>");
                row.append("<td>" + movie.releaseDate + "</td>");
                row.append("<td>" + movie.movieBoxOffice + "</td>");
                row.append("<td>" + movie.movieIntroduction + "</td>");
                /* 将新的表格行添加到电影表格的主体部分 */
                tableBody.append(row);
            });
        }
    });
</script>
</body>
</html>